<!DOCTYPE html>
<html>
<head>
    <title>登入</title>
    <#include "/common/include_header.ftl">
</head>
<body>

    <#include "/common/include_top.ftl">

<div class="layui-container fly-marginTop fly-user-main">

    <#include "/common/include_menu.ftl">

    <div class="site-tree-mobile layui-hide">
        <i class="layui-icon">&#xe602;</i>
    </div>
    <div class="site-mobile-shade"></div>

    <div class="site-tree-mobile layui-hide">
        <i class="layui-icon">&#xe602;</i>
    </div>
    <div class="site-mobile-shade"></div>


    <div class="fly-panel fly-panel-user" pad20>


        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>2018世界范围内编程语言排行榜</legend>
        </fieldset>

        <#--<table class="layui-table" lay-data="{url:'www.layui.com/test/table/demo1.json', id:'test3'}" lay-filter="test3">-->
        <table class="layui-table" lay-data="{url:'/static/res/json/demo.json', id:'test3'}" lay-filter="test3">
            <thead>
            <tr>
                <#--<th lay-data="{type:'checkbox'}">name2</th>-->
                <th lay-data="{field:'id', width:80, sort: true, edit: 'text'}">name</th>
                <th lay-data="{field:'username', sort: true, edit: 'text'}">value1</th>
                <th lay-data="{field:'email', edit: 'text', minWidth: 150}">value2</th>
                <th lay-data="{field:'sex',  edit: 'text'}">value3</th>
                <th lay-data="{field:'city', edit: 'text', minWidth: 100}">value4</th>
                <th lay-data="{field:'experience', sort: true, edit: 'text'}">value5</th>
            </tr>
            </thead>
        </table>


        <#--<script src="//res.layui.com/layui/dist/layui.js" charset="utf-8"></script>-->
        <script src="/static/js/layui.js"></script>

        <!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
        <script>
            layui.use('table', function(){
                var table = layui.table;

                //监听单元格编辑
                table.on('edit(test3)', function(obj){
                    var value = obj.value //得到修改后的值
                            ,data = obj.data //得到所在行所有键值
                            ,field = obj.field; //得到字段
                    layer.msg('[ID: '+ data.id +'] ' + field + ' 字段更改为：'+ value);
                });
            });
        </script>


    </div>
</div>





<#include "/common/include_footer.ftl">
<#--<#include "/common/include_js.ftl">-->

</body>
</html>